<!--
 * @Author: Vi卡农
 * @Date: 2020-02-27 17:08:38
 * @LastEditTime: 2020-05-08 15:40:50
 * @Description: -房源信息列表-
 * @FilePath: \cshf_admin\src\views\modules\house\houseinfo.vue
 -->
<template>
  <el-card shadow="never" class="aui-card--fill" ref="fromc">
    <div class="mod-house__houseinfo">
      <el-form :inline="true" :model="dataForm" ref="froma">
        <el-row>
          <el-col :span="16">
            <el-form-item>
              类型：
              <ren-select
                v-model="dataForm.houseType"
                dict-type="houseType"
                class="FormSelect"
                clearable
              ></ren-select>
            </el-form-item>
            <el-form-item>
              交易：
              <ren-select
                v-model="dataForm.transactionType"
                dict-type="houseTransactionType"
                class="FormSelect"
                clearable
              ></ren-select>
            </el-form-item>
            <el-form-item>
              审核：
              <ren-select
                v-model="dataForm.examine"
                dict-type="examine"
                placeholder="审核类型"
                class="FormSelect"
              ></ren-select>
            </el-form-item>
            <el-form-item>
              同步：
              <el-select v-model="dataForm.extranet" class="FormSelect" clearable>
                <el-option label="已同步" value="1"></el-option>
                <el-option label="未同步" value="0"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              区域：
              <el-select
                v-model="dataForm.districtCode"
                placeholder="请选择"
                clearable
                @change="CityRegionChange"
                class="FormSelect"
              >
                <el-option
                  v-for="item in this.$store.state.CityRegion"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              商圈：
              <el-select
                v-model="dataForm.business"
                placeholder="请选择"
                :disabled="dataForm.districtCode==''"
                class="FormSelect"
                clearable
              >
                <el-option
                  v-for="item in businessList"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              家具：
              <el-select v-model="dataForm.furniture" class="FormSelect" clearable>
                <el-option label="没有" value="0"></el-option>
                <el-option label="有" value="1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              部门：
              <el-cascader
                class="FormSelect"
                v-model="deptSelectVal"
                :options="this.$store.state.DeptList"
                :show-all-levels="false"
                @change="deptIdChange"
                :props="deptProps"
                ref="myCascader"
                clearable
              ></el-cascader>-
              <el-select
                v-model="dataForm.userId"
                placeholder="人员"
                class="FormSelect"
                clearable
                :disabled="dataForm.deptId==''"
              >
                <el-option
                  v-for="item in maintainList"
                  :key="item.id"
                  :label="item.realName"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
            <el-form-item>
              <el-checkbox v-model="dataForm.selfHouse" true-label="1" false-label="0">我的房源</el-checkbox>
              <el-checkbox v-model="dataForm.selfDeal" true-label="1" false-label="0">自己成交</el-checkbox>
              <el-checkbox v-model="dataForm.image" true-label="1" false-label="0">图片</el-checkbox>
              <el-checkbox v-model="dataForm.video" true-label="1" false-label="0">视频</el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="8">
          <el-form-item label="楼盘" prop="dictId" class="from_item_mini">
            <el-select
              v-model="dataForm.dictId"
              filterable
              placeholder="关键字搜索"
            >
              <el-option
                v-for="item in dictList"
                :key="item.id"
                :label="item.name"
                :value="item.id"
                @click.native="LPlistChange(item)"
              ></el-option>
            </el-select>
          </el-form-item>
       
          <el-form-item label="座栋" prop="zdId" class="from_item_mini">
            <el-select
              v-model="dataForm.zdId"
              @change="ZDlistChange"
            >
              <el-option v-for="item in zdList" :key="item.id" :label="item.num" :value="item.id"></el-option>
            </el-select>
          </el-form-item>
       
          <el-form-item label="单元" prop="dyId" class="from_item_mini" >
             <el-select v-model="dataForm.dyId" @change="DYlistChange">
              <el-option
                v-for="item in dyList"
                :key="item.id"
                :label="item.num+'单元'"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-form-item>
     
            <el-form-item label="智能"  class="from_item_mini" >
            <el-input v-model="dataForm.name" placeholder="楼盘名"  clearable></el-input>
            </el-form-item>
            <el-input
              placeholder="请输入内容"
              v-model="dataForm.search"
              class="input-with-select"
              @keyup.enter.native="getDataList"
              clearable
              style="width:50%"
            >
              <el-button slot="append" icon="el-icon-search" @click="getDataList"></el-button>
            </el-input>
          </el-col>
          <el-col :span="24">
            <el-form-item>
              楼盘类型：
              <ren-select
                v-model="dataForm.type"
                dict-type="dictType"
                placeholder="楼盘类型"
                class="FormSelect"
                clearable
              ></ren-select>
            </el-form-item>
            <el-form-item>
              装修：
              <ren-select
                v-model="dataForm.renovation"
                dict-type="dictRenovation"
                placeholder="装修"
                class="FormSelect"
                clearable
              ></ren-select>
            </el-form-item>
            <el-form-item>
              单价：
              <el-input v-model="dataForm.prices" placeholder="最低价" class="Section_inp" clearable></el-input>
              {{' -'}}
              <el-input v-model="dataForm.pricee" placeholder="最高价" class="Section_inp" clearable></el-input>
            </el-form-item>
            <el-form-item>
              总价：
              <el-input v-model="dataForm.pricess" placeholder="最低价" class="Section_inp" clearable></el-input>
              {{' -'}}
              <el-input v-model="dataForm.pricese" placeholder="最高价" class="Section_inp" clearable></el-input>
            </el-form-item>
            <el-form-item>
              面积：
              <el-input v-model="dataForm.areas" placeholder="最小" class="Section_inp" clearable></el-input>
              {{' -'}}
              <el-input v-model="dataForm.areae" placeholder="最大" class="Section_inp" clearable></el-input>
            </el-form-item>
            <el-form-item>
              楼层：
              <el-input
                v-model="dataForm.storeyCoordinates"
                placeholder="低楼层"
                class="Section_inp"
                clearable
              ></el-input>
              {{' -'}}
              <el-input
                v-model="dataForm.storeyCoordinatee"
                placeholder="高楼层"
                class="Section_inp"
                clearable
              ></el-input>
            </el-form-item>
            <el-form-item>
              状态：
              <ren-select
                v-model="dataForm.state"
                dict-type="dictState"
                placeholder="状态"
                class="FormSelect"
                clearable
              ></ren-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item>
              录入日期：
              <el-select
                v-model="dataForm.date"
                @change="dateSelectChange"
                class="FormSelect"
                clearable
              >
                <el-option label="自定义" value="6"></el-option>
                <el-option label="当天" value="1"></el-option>
                <el-option label="本周" value="2"></el-option>
                <el-option label="本月" value="3"></el-option>
                <el-option label="本季度" value="4"></el-option>
                <el-option label="今年" value="5"></el-option>
              </el-select>&nbsp;
              <el-date-picker
                v-model="dataForm.createDates"
                type="date"
                placeholder="开始时间"
                value-format="yyyy-MM-dd"
                style="width:136px"
                :disabled="dataForm.date!='6'"
              ></el-date-picker>
              {{' -'}}
              <el-date-picker
                v-model="dataForm.createDatee"
                type="date"
                placeholder="结束时间"
                value-format="yyyy-MM-dd"
                style="width:136px"
                :disabled="dataForm.date!='6'"
              ></el-date-picker>
            </el-form-item>
            <el-form-item>
              跟进日期：
              <el-date-picker
                v-model="dataForm.followTimes"
                type="date"
                placeholder="开始时间"
                value-format="yyyy-MM-dd"
                style="width:136px"
              ></el-date-picker>
              {{' -'}}
              <el-date-picker
                v-model="dataForm.followTimee"
                type="date"
                placeholder="结束时间"
                value-format="yyyy-MM-dd"
                style="width:136px"
              ></el-date-picker>
            </el-form-item>
            <el-form-item>
              <el-button @click="Reset">重置</el-button>
            </el-form-item>
            <el-form-item style="margin-left:10px">
              查看来源：
              <el-select v-model="dataForm.self" style="width:130px">
                <el-option label="查看所有房源" value="1"></el-option>
                <el-option label="查看维护房源" value="0"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item v-if="$hasPermission('house:houseinfo:save')">
              <!-- <el-button
                                v-if="$hasPermission('house:houseinfo:save')"
                                type="primary"
                                @click="addOrUpdateHandle()"
              >新增</el-button>-->
              <el-dropdown>
                <el-button type="primary">
                  添加-租
                  <i class="el-icon-arrow-down el-icon--right"></i>
                </el-button>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item style="width:80px" @click.native="addSelectChange('1')">写字楼</el-dropdown-item>
                  <el-dropdown-item style="width:80px" @click.native="addSelectChange('3')">住宅</el-dropdown-item>
                  <el-dropdown-item style="width:80px">商铺</el-dropdown-item>
                  <!-- <el-dropdown-item
                    style="width:80px"
                    @click.native="addSelectChange('5')"
                  >商租</el-dropdown-item>-->
                </el-dropdown-menu>
              </el-dropdown>
            </el-form-item>
            <el-form-item v-if="$hasPermission('house:houseinfo:save')">
              <el-dropdown style="margin-left:10px">
                <el-button type="primary">
                  添加-买
                  <i class="el-icon-arrow-down el-icon--right"></i>
                </el-button>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item style="width:80px" @click.native="addSelectChange('2')">写字楼</el-dropdown-item>
                  <el-dropdown-item style="width:80px" @click.native="addSelectChange('4')">住宅</el-dropdown-item>
                  <el-dropdown-item style="width:80px">商铺</el-dropdown-item>
                  <!-- <el-dropdown-item
                    style="width:80px"
                    @click.native="addSelectChange('6')"
                  >商买</el-dropdown-item>-->
                </el-dropdown-menu>
              </el-dropdown>
            </el-form-item>
            <el-form-item>
              <el-button
                v-if="$hasPermission('house:houseinfo:delete')&&dataForm.self=='0'"
                type="primary"
                @click="deleteHandle()"
              >{{ $t('delete') }}</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <el-table
        v-loading="dataListLoading"
        :data="dataList"
        :row-key="getRowKeys"
        @selection-change="dataListSelectionChangeHandle"
        style="width: 100%;"
        border
        stripe
        :height="autoTabHeight"
        highlight-current-row
        @row-dblclick="tableRowDbclick"
        @sort-change="dataListSortChangeHandle"
        :expand-row-keys="expands"
        @expand-change="expandSelect"
      >
        <el-table-column type="expand">
          <template slot-scope="props">
            <div class="houseinfoFollow">
              <el-card class="box-card FY_details" shadow="hover">
                <el-row>
                  <!-- <el-col :span="6">
                    <ul class="Owner">
                      <li>
                        <div
                          class="lp_card_bh"
                        >房源编号：{{"FY - "+FollowTableForm.id.substring(FollowTableForm.id.length-6)}}</div>
                      </li>
                      <li>
                        <span>业主：</span>
                        <span class="colorGray">{{OwnerInfoForm.ownerName}}</span>
                      </li>
                      <li>
                        <span>公司名字：</span>
                        <span class="colorGray">{{OwnerInfoForm.ownerCompanyName}}</span>
                      </li>
                      <li>
                        <span>包租：</span>
                        <span class="colorGray">{{OwnerInfoForm.ownerLeaseName}}</span>
                      </li>
                      <li>
                        <span>委托人：</span>
                        <span class="colorGray">{{OwnerInfoForm.ownerClientName}}</span>
                      </li>
                    </ul>
                  </el-col>-->
                  <el-col :span="24">
                    <el-table :data="FollowTableData" class="FY_table_gj" max-height="150">
                      <el-table-column prop="content" label="跟进内容"></el-table-column>
                      <el-table-column prop="creatorName" label="跟进人" width="120"></el-table-column>
                      <el-table-column prop="deptName" label="跟进部门" width="120"></el-table-column>
                      <el-table-column prop="createDate" label="跟进时间" width="150"></el-table-column>
                    </el-table>
                  </el-col>
                </el-row>
              </el-card>
            </div>
          </template>
        </el-table-column>
        <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
        <el-table-column prop="id" label="编号" header-align="center" align="center" width="100">
          <template slot-scope="scope">{{"FY - "+scope.row.id.substring(scope.row.id.length-6)}}</template>
        </el-table-column>
        <el-table-column prop="houseType" label="类型" header-align="center" align="center">
          <template slot-scope="scope">{{ $getDictLabel("houseType", scope.row.houseType) }}</template>
        </el-table-column>
        <el-table-column
          prop="key"
          label="钥匙"
          header-align="center"
          align="center"
          width="70"
          sortable="custom"
        >
          <template slot-scope="scope">
            <svg
              :class="scope.row.key!=null&&scope.row.key.toString()=='1'?'icon-svg svgColor1':'icon-svg svgColor2'"
              aria-hidden="true"
            >
              <use xlink:href="#key" />
            </svg>
          </template>
        </el-table-column>
        <el-table-column
          prop="image"
          label="图片"
          header-align="center"
          align="center"
          width="70"
          sortable="custom"
        >
          <template slot-scope="scope">
            <svg
              :class="scope.row.image!=null&&scope.row.image.toString()=='1'?'icon-svg svgColor1 images_icon':'icon-svg svgColor2 images_icon'"
              aria-hidden="true"
            >
              <use xlink:href="#images" />
            </svg>
          </template>
        </el-table-column>
        <el-table-column
          prop="transactionType"
          label="交易"
          header-align="center"
          align="center"
          width="70"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span
              :class="scope.row.transactionType==1?'typeColor1':'typeColor2'"
            >{{ $getDictLabel("houseTransactionType", scope.row.transactionType).slice(0,1) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="districtCode"
          label="商圈区域"
          header-align="center"
          align="center"
          width="130"
        >
          <template
            slot-scope="scope"
          >{{ $Dictionaries("CityRegion", scope.row.districtCode) }} - {{ $Dictionaries("BusinessPage", scope.row.business) }}</template>
        </el-table-column>
        <el-table-column
          prop="dictName"
          label="楼盘"
          header-align="center"
          align="center"
          width="130"
        >
          <template slot-scope="scope">
            <span class="font_weight">{{scope.row.dictName}}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="zdNum"
          label="座栋"
          header-align="center"
          align="center"
          sortable="custom"
          width="70"
        >
          <template slot-scope="scope">{{scope.row.zdNum+' '+scope.row.zdUnit}}</template>
        </el-table-column>
        <el-table-column
          prop="dyNum"
          label="单元"
          header-align="center"
          align="center"
          sortable="custom"
          width="70"
        >
          <template slot-scope="scope">{{scope.row.dyNum+'单元'}}</template>
        </el-table-column>
        <!-- <el-table-column
            prop="dictName"
            label="楼盘字典"
            header-align="center"
            align="center"
            width="180"
        >
            <template
                slot-scope="scope"
            >{{ scope.row.dictName+' '+scope.row.zdNum+scope.row.zdUnit+' '+scope.row.dyNum+'单元 '+scope.row.num}}</template>
        </el-table-column>-->
        <el-table-column
          prop="num"
          label="房号"
          header-align="center"
          align="center"
          sortable="custom"
          width="70"
        ></el-table-column>
        <el-table-column
          prop="area"
          label="面积（㎡）"
          header-align="center"
          align="center"
          width="110"
          sortable="custom"
        ></el-table-column>
        <el-table-column
          prop="price"
          label="单价"
          header-align="center"
          align="center"
          width="90"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span
              v-if="scope.row.price"
            >{{ scope.row.transactionType==0?scope.row.price+' 元':scope.row.price+' 元/㎡'}}</span>
            <span v-else>{{ scope.row.price}}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="prices"
          label="总价"
          header-align="center"
          align="center"
          width="90"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span
              v-if="scope.row.prices"
            >{{ scope.row.transactionType==0?scope.row.prices+' 万元':scope.row.prices+' 元/月'}}</span>
            <span v-else>{{ scope.row.prices}}</span>
          </template>
        </el-table-column>
        <!-- <el-table-column
          prop="renovation"
          label="装修"
          header-align="center"
          align="center"
          sortable="custom"
        >
          <template slot-scope="scope">{{ $getDictLabel("dictRenovation", scope.row.renovation) }}</template>
        </el-table-column>

        <el-table-column
          prop="furniture"
          label="家具"
          header-align="center"
          align="center"
          sortable="custom"
          width="70"
        >
          <template
            slot-scope="scope"
          >{{scope.row.furniture!=null&&scope.row.furniture.toString()=='1'?'有':'无'}}</template>
        </el-table-column> -->
        <el-table-column prop="type" label="类型" header-align="center" align="center" width="60">
          <template slot-scope="scope">
            <span
              :style="dictTypeColor(scope.row.type)"
            >{{ $getDictLabel("dictType", scope.row.type) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="sortType"
          label="房源归类"
          header-align="center"
          align="center"
          sortable="custom"
          width="96"
        >
          <template slot-scope="scope">
            <span>{{ $getDictLabel("houseSortType", scope.row.sortType) }}</span>
          </template>
        </el-table-column>
        <el-table-column
          prop="lookMode"
          label="看房"
          header-align="center"
          align="center"
          sortable="custom"
          width="70"
        >
          <template slot-scope="scope">{{$getDictLabel("dictLookMode", scope.row.lookMode)}}</template>
        </el-table-column>
        <el-table-column
          prop="situation"
          label="现状"
          header-align="center"
          align="center"
          sortable="custom"
          width="80"
        >
          <template slot-scope="scope">{{$getDictLabel("dictSituation", scope.row.situation)}}</template>
        </el-table-column>
        <el-table-column
          prop="examine"
          label="审核"
          header-align="center"
          align="center"
          v-if="dataForm.self=='0'"
        >
          <template slot-scope="scope">
            <el-switch
              v-model="scope.row.examine"
              @change="tabExamineChange(scope.row)"
              :active-value="1"
              :inactive-value="0"
              :disabled="!$hasPermission('house:houseinfo:updateExamine')"
            ></el-switch>
          </template>
        </el-table-column>
        <el-table-column
          prop="extranet"
          label="同步"
          header-align="center"
          align="center"
          v-if="dataForm.self=='0'"
        >
          <template slot-scope="scope">
            <el-switch
              class="switchStyle"
              v-model="scope.row.extranet"
              :active-value="1"
              :inactive-value="0"
              @change="tabExtranetChange(scope.row)"
              :disabled="!$hasPermission('house:houseinfo:updateExtranet')"
            ></el-switch>
          </template>
        </el-table-column>
        <!-- <el-table-column
          prop="source"
          label="来源"
          header-align="center"
          align="center"
          sortable="custom"
          width="80"
        >
          <template slot-scope="scope">{{$getDictLabel("houseSource", scope.row.source)}}</template>
        </el-table-column> -->
        <el-table-column
          prop="state"
          label="状态"
          header-align="center"
          align="center"
          sortable="custom"
          width="80"
        >
          <template slot-scope="scope">{{$getDictLabel("dictState", scope.row.state)}}</template>
        </el-table-column>
        <el-table-column
          prop="maintainName"
          label="维护人"
          header-align="center"
          align="center"
          sortable="custom"
          width="96"
        ></el-table-column>
        <!-- <el-table-column
          prop="createDate"
          label="录入时间"
          header-align="center"
          align="center"
          width="100"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span>{{scope.row.createDate?scope.row.createDate.substring(0,10):scope.row.createDate}}</span>
          </template>
        </el-table-column> -->
        <el-table-column
          prop="followTime"
          label="最新跟进"
          header-align="center"
          align="center"
          width="100"
          sortable="custom"
        >
          <template slot-scope="scope">
            <span>{{scope.row.followTime?scope.row.followTime.substring(0,10):scope.row.followTime}}</span>
          </template>
        </el-table-column>0
      </el-table>
      <!-- <div style="height:200px;"></div> -->
      <div class="paginationBox">
        <el-pagination
          :current-page="page"
          :page-sizes="[10, 20, 50, 100]"
          :page-size="limit"
          :total="total"
          layout="total, sizes, prev, pager, next, jumper"
          @size-change="pageSizeChangeHandle"
          @current-change="pageCurrentChangeHandle"
        ></el-pagination>
      </div>
      <!-- <div class="houseinfoFollow" v-if="FollowDrawer">
        <el-card class="box-card FY_details" shadow="hover">
          <el-row>
            <el-col :span="6">
              <ul class="Owner">
                <li>
                  <div
                    class="lp_card_bh"
                  >房源编号：{{"FY - "+FollowTableForm.id.substring(FollowTableForm.id.length-6)}}</div>
                </li>
                <li>
                  <span>业主：</span>
                  <span class="colorGray">{{OwnerInfoForm.ownerName}}</span>
                </li>
                <li>
                  <span>公司名字：</span>
                  <span class="colorGray">{{OwnerInfoForm.ownerCompanyName}}</span>
                </li>
                <li>
                  <span>包租：</span>
                  <span class="colorGray">{{OwnerInfoForm.ownerLeaseName}}</span>
                </li>
                <li>
                  <span>委托人：</span>
                  <span class="colorGray">{{OwnerInfoForm.ownerClientName}}</span>
                </li>
              </ul>
            </el-col>
            <el-col :span="18">
              <el-table :data="FollowTableData" class="FY_table_gj" max-height="150">
                <el-table-column prop="content" label="跟进内容"></el-table-column>
                <el-table-column prop="creatorName" label="跟进人" width="120"></el-table-column>
                <el-table-column prop="deptName" label="跟进部门" width="120"></el-table-column>
                <el-table-column prop="createDate" label="跟进时间" width="150"></el-table-column>
              </el-table>
            </el-col>
          </el-row>
        </el-card>
      </div>-->
      <!-- <el-pagination
        :current-page="page2"
        :page-sizes="[5,10, 20, 50, 100]"
        :page-size="limit2"
        :total="total2"
        layout="total, sizes, prev, pager, next, jumper"
        @size-change="pageSizeChangeHandle2"
        @current-change="pageCurrentChangeHandle2"
      ></el-pagination>-->

      <!-- 弹窗, 新增 / 修改 -->
      <component v-if="addOruUpdate" :is="zjName" @CloseDialog="CloseDialogFun"></component>
    </div>
  </el-card>
</template>

<script>
import mixinViewModule from "@/mixins/view-module";
export default {
  mixins: [mixinViewModule],
  data() {
    return {
      mixinViewModuleOptions: {
        createdIsNeed: false,
        getDataListURL: "/house/houseinfo/page",
        getDataListIsPage: true,
        exportURL: "/house/houseinfo/export",
        deleteURL: "/house/houseinfo",
        deleteIsBatch: true
      },
      MaintainType: false,
      dataForm: {
        id: this.$route.query.moduleId ? this.$route.query.moduleId : "",
        dictId: this.$route.query.dictId ? this.$route.query.dictId : "",
        zdId:"",
        dyId:"",
        dictName: "",
        houseType: "", //房源类型
        transactionType: this.$route.query.transactionType
          ? this.$route.query.transactionType
          : "", //交易类型
        examine: "", //审核状态
        extranet: "", //外网同步
        districtCode: "", //行政区域
        business: "", //商圈
        furniture: "", //家具
        deptId: "", //部门
        userId: this.$route.query.userId ? this.$route.query.userId : "",
        selfHouse: "0", //我的房源
        selfDeal: "0", //我的成交
        image: "", //图片
        video: "", //图片
        renovation: "", //装修
        type: "", //楼盘类型
        prices: "",
        pricee: "",
        pricess: "",
        pricese: "",
        areas: "",
        areae: "",
        createDates: "",
        createDatee: "",
        staDate: "",
        statisticDates: "",
        statisticDatee: "",
        statisticType: "",
        houseModuleId: "",
        followTimes: "",
        followTimee: "",
        self: "1",
        date: "6",
        state: "1",
        search: "",
        name: "",
        storeyCoordinates: "",
        storeyCoordinatee: ""
      },
      limit: 20,
      businessList: [],
      select_type: "1",
      OwnerInfoForm: {
        ownerName: "",
        ownerCompanyName: "",
        ownerLeaseName: "",
        ownerClientName: ""
      },
      FollowTableData: [],
      page2: 1, // 当前页码
      limit2: 50, // 每页数
      total2: 0, // 总条数
      FollowTableForm: {
        id: ""
      },
      deptProps: {
        value: "id",
        label: "name",
        checkStrictly: true
      },
      deptSelectVal: "",
      addOruUpdate: false,
      addUrl: "",
      autoTabHeight: 700,
      FollowDrawer: false,
      maintainList: [],
      getRowKeys(row) {
        return row.id;
      },
      expands: [],
      dictList: [],
      zdList: [],
      dyList: [],
    };
  },
  computed: {
    zjName: {
      get: function() {
        this.addUrl;
        var myComponent = () => import(`${this.addUrl}`);
        return myComponent;
      }
    }
  },
  created() {
    this.getDictList();
    if (this.$route.query.statisticType) {
      this.statisticOpen();
    } else { 
      this.getDataList();
    }
    this.$nextTick(() => {
      this.autoWidth();
    });
  },
  mounted() {
    let _this = this;
    window.onresize = function() {
      _this.autoWidth();
    };
  },
  methods: {
    autoWidth() {
      let that = this;
      let formh = that.$refs.froma.$el.offsetHeight;
      let h = that.$refs.fromc.$el.offsetHeight;
      let heightStyle = h - formh - 45;
      that.autoTabHeight = heightStyle;
    },
    statisticOpen() {
      if (this.$route.query.houseModuleId == 1) {
        let statisticType = this.$route.query.statisticType;
        this.dataForm.userId = "";
        if (statisticType == 1) {
          this.dataForm.userId = this.$route.query.id;
        } else {
          this.deptSelectVal = this.$route.query.id;
          this.dataForm.deptId = this.$route.query.id;
        }
         this.dataForm.houseModuleId="";
        this.dataForm.state = this.$route.query.state;
         this.dataForm.staDate = this.$route.query.date;
          this.dataForm.statisticDates = this.$route.query.createDates;
          this.dataForm.statisticDatee = this.$route.query.createDatee;
        //房源图跳转
      }  else if (this.$route.query.houseModuleId == 2 || this.$route.query.houseModuleId == 4) {
         let statisticType = this.$route.query.statisticType;
          this.dataForm.userId = "";
          if (statisticType == 1) {
            this.dataForm.userId = this.$route.query.id;
          } else {
            this.deptSelectVal = this.$route.query.id;
            this.dataForm.deptId = this.$route.query.id;
          }
          this.dataForm.houseModuleId = this.$route.query.houseModuleId;
          this.dataForm.state = this.$route.query.state;
          this.dataForm.staDate = this.$route.query.date;
          this.dataForm.statisticDates = this.$route.query.createDates;
          this.dataForm.statisticDatee = this.$route.query.createDatee;
         
        }
    },
    //行政区选择change
    CityRegionChange(val) {
      this.businessList = [];
      this.dataForm.business = "";
      this.$http
        .get(`/dictionary/business/businessList`, {
          params: {
            districtCode: val
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          this.businessList = res.data;
        })
        .catch(() => {});
    },
    Reset() {
      this.dataForm = {
        id: "",
        name: "",
        houseType: "", //房源类型
        transactionType: "", //交易类型
        dictId: this.$route.query.dictId ? this.$route.query.dictId : "",
        zdId: "",
        dyId: "",
        examine: "", //审核状态
        extranet: "", //外网同步
        districtCode: "", //行政区域
        business: "", //商圈
        furniture: "", //家具
        deptId: "", //部门
        selfHouse: "0", //我的房源
        selfDeal: "0", //我的成交
        image: "", //图片=
        video: "", //视频
        renovation: "", //装修
        type: "", //楼盘类型
        prices: "",
        pricee: "",
        pricess: "",
        pricese: "",
        areas: "",
        areae: "",
        createDates: "",
        createDatee: "",
        followTimes: "",
        followTimee: "",
        self: "1",
        date: "6",
        state: "1",
        search: "",
        name: "",
        storeyCoordinates: "",
        storeyCoordinatee: "",
        userId: ""
      };
    },
    //审核
    tabExamineChange(row) {
      this.$http
        .put(
          `/house/houseinfo/updateExamine`,
          {},
          {
            params: {
              id: row.id,
              examine: row.examine
            }
          }
        )
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          this.$message.success("更改成功");
        })
        .catch(() => {});
    },
    //外网同步
    tabExtranetChange(row) {
      this.$http
        .put(
          `/house/houseinfo/updateExtranet`,
          {},
          {
            params: {
              id: row.id,
              extranet: row.extranet
            }
          }
        )
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          this.$message.success("更改成功");
        })
        .catch(() => {});
    },
    //行单击
    tableRowClick(row) {
      // if (this.FollowDrawer == false) {
      //   this.FollowDrawer = true;
      // } else {
      //   this.FollowDrawer = false;
      // }
      this.FollowTableForm = row;
      this.getFjOwnerInfo();
      this.getPageFollow();
    },
    //行双击
    tableRowDbclick(row) {
      if (this.dataForm.self == "0") {
        sessionStorage.setItem("MaintainType", "true");
      } else {
        sessionStorage.setItem("MaintainType", "false");
      }
      this.$router.push({
        name: "HousingPages",
        query: {
          ID: row.id,
          transactionType: row.transactionType,
          type: row.type
        }
      });
    },
    //获取业主信息
    getFjOwnerInfo() {
      let _this = this;
      this.$http
        .get(`/house/houseinfo/getFjOwnerInfo`, {
          params: {
            id: _this.FollowTableForm.id
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          _this.OwnerInfoForm = res.data;
        })
        .catch(() => {});
    },

    //获取房源跟进记录
    getPageFollow() {
      let _this = this;
      this.$http
        .get(`/house/houseinfo/pageFollow`, {
          params: {
            page: 1,
            limit: 50,
            id: _this.FollowTableForm.id
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          _this.FollowTableData = res.data.list;
          // _this.total2 = res.data.total;
        })
        .catch(() => {});
    },
    // 分页, 每页条数
    pageSizeChangeHandle2(val) {
      this.page2 = 1;
      this.limit2 = val;
      this.getPageFollow();
    },
    // 分页, 当前页
    pageCurrentChangeHandle2(val) {
      this.page2 = val;
      this.getPageFollow();
    },
    //点击维护按钮
    MaintainClick() {
      this.MaintainType = true;
    },
    deptIdChange(val) {
      let a = "";
      if (this.$refs.myCascader.getCheckedNodes()[0]) {
        a = this.$refs.myCascader.getCheckedNodes()[0].value;
        this.dataForm.deptId = a;
        this.getUserList(a);
      } else {
        this.dataForm.deptId = "";
      }
    },
    // 获取部门员工列表
    getUserList(deptId) {
      let _this = this;
      this.$http
        .get(`/sys/user/deptUserList`, {
          params: {
            deptId: deptId
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          _this.maintainList = res.data;
        })
        .catch(() => {});
    },
    // 日期方式切换
    dateSelectChange(val) {
      if (val != "6") {
        this.dataForm.createDates = "";
        this.dataForm.createDatee = "";
      }
    },
    //点击添加
    addSelectChange(val) {
      this.addOruUpdate = true;
      if (val == "6") {
        //商买
        // this.addUrl = "./page/customermsinfo-add-or-update";
      } else if (val == "2") {
        //写买
        this.addUrl = "./page/houseXM-add";
      } else if (val == "4") {
        //住买
        this.addUrl = "./page/houseZM-add";
      } else if (val == "5") {
        //商租
        // this.addUrl = "./page/customerzsinfo-add-or-update";
      } else if (val == "1") {
        //写租
        this.addUrl = "./page/houseXZ-add";
      } else if (val == "3") {
        //住租
        this.addUrl = "./page/houseZZ-add";
      }
    },
    CloseDialogFun() {
      this.addOruUpdate = false;
    },
    //展开行
    expandSelect(row, expandedRows) {
      var _this = this;
      _this.tableRowClick(row);
      if (expandedRows.length) {
        _this.expands = [];
        if (row) {
          _this.expands.push(row.id); // 每次push进去的是每行的ID
        }
      } else {
        _this.expands = []; // 默认不展开
      }
    },
     //获取楼盘列表
    getDictList() {
      let _this = this;
      this.$http
        .get(`/house/houseinfo/dictList`, {
          params: {
            name: ""
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          this.dictList = res.data;
        })
        .catch(() => {});
    },
    //楼盘列表change
    LPlistChange(item) {
      this.zdList = [];
      this.dyList = [];
      this.fjList = [];
      this.dataForm.dictId = item.id;
      this.dataForm.dyId = "";
      this.getZdList(item.id);
      this.dataForm.type = item.type;
      this.dataForm.districtCode = item.districtCode;
      this.dataForm.business = item.business;
    },
    //获取楼盘座栋列表
    getZdList(id) {
      let _this = this;
      this.zdList = [];
      this.dataForm.zdId = "";
      this.$http
        .get(`/house/houseinfo/zdList`, {
          params: {
            dictId: id,
            num: ""
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          this.zdList = res.data;
        })
        .catch(() => {});
    },

    //座栋change
    ZDlistChange(val) {
      this.getDyList(val);
    },

    //获取楼盘座栋单元列表
    getDyList(id) {
      let _this = this;
      this.dyList = [];
      this.dataForm.dyId = "";
      this.$http
        .get(`/house/houseinfo/dyList`, {
          params: {
            zdId: id
          }
        })
        .then(({ data: res }) => {
          if (res.code !== 0) {
            return this.$message.error(res.msg);
          }
          this.dyList = res.data;
        })
        .catch(() => {});
    },
 //单元列表change
    DYlistChange(val) {
      this.$forceUpdate()

    },
  },
  watch: {
    dataForm: {
      handler(nowVal, oldVal) {
        this.getDataList();
      },
      deep: true
    },
    dataList: {
      handler(nowVal, oldVal) {
        if (nowVal.length > 0) {
          this.FollowTableForm = nowVal[0];
          this.getFjOwnerInfo();
          this.getPageFollow();
        }
      }
      // deep: true
    },
    $route(to, from) {
      // this.MaintainType = JSON.parse(sessionStorage.getItem("MaintainType"));
      if (to.name == "house-houseinfo") {
        if (this.$route.query.houseModuleId == 1) {
          let statisticType = this.$route.query.statisticType;
          this.dataForm.userId = "";
          if (statisticType == 1) {
            this.dataForm.userId = this.$route.query.id;
          } else {
            this.deptSelectVal = this.$route.query.id;
            this.dataForm.deptId = this.$route.query.id;
          }
           this.dataForm.houseModuleId="";
          this.dataForm.state = this.$route.query.state;
          this.dataForm.staDate = this.$route.query.date;
          this.dataForm.statisticDates = this.$route.query.createDates;
          this.dataForm.statisticDatee = this.$route.query.createDatee;
          //房源图跳转  //备件图跳转
        } else if (this.$route.query.houseModuleId == 2 || this.$route.query.houseModuleId == 4) {
         let statisticType = this.$route.query.statisticType;
          this.dataForm.userId = "";
          if (statisticType == 1) {
            this.dataForm.userId = this.$route.query.id;
          } else {
            this.deptSelectVal = this.$route.query.id;
            this.dataForm.deptId = this.$route.query.id;
          }
          this.dataForm.houseModuleId = this.$route.query.houseModuleId;
          this.dataForm.state = this.$route.query.state;
          this.dataForm.staDate = this.$route.query.date;
          this.dataForm.statisticDates = this.$route.query.createDates;
          this.dataForm.statisticDatee = this.$route.query.createDatee;
         
        }  else if (this.$route.query.userId) {
          this.dataForm.userId = this.$route.query.userId;
          this.dataForm.state = this.$route.query.state;
          this.dataForm.staDate = this.$route.query.date;
          this.dataForm.statisticDates = this.$route.query.createDates;
          this.dataForm.statisticDatee = this.$route.query.createDatee;
        } else if (this.$route.query.dictId) {
          this.dataForm.dictId = this.$route.query.dictId;
          this.dataForm.transactionType = this.$route.query.transactionType;
          this.getDataList();
        } else if (this.$route.query.moduleId) {
          this.dataForm.id = this.$route.query.moduleId;
          this.dataForm.state = "";
        }
      }
    }
  }
};
</script>
<style lang="scss" scoped>
.el-checkbox {
  margin-right: 10px;
}
.lp_card_bh {
  font-size: 16px;
  font-weight: 600;
  text-align: center;
}

.FY_details {
  font-weight: 600;
  color: #333333;
  ul {
    width: 90%;
    list-style: none;
    margin: 0px;
    padding: 0;
    // margin-top: 10px;
    border-right: 1px solid #e6e6e6;
    li {
      margin-top: 18px;
    }
  }
  .el-card__body {
    padding: 0px;
  }
}

.images_icon {
  width: 18px;
  height: 18px;
}
// 租
.typeColor1 {
  color: rgb(0, 171, 255);
}
// 售
.typeColor2 {
  color: red;
}
.houseinfoFollow {
  width: 1500px;
  // position: fixed;
  // bottom: 0;
  // right: 0;
  // z-index: 1300;
}
</style>